<template>
  <el-row>
    <el-form
      :model="addForm"
      label-width="130px"
      :show-message="false"
      :rules="addFormRules"
      ref="addForm"
      
    >
      <el-form-item
        label="银行账户代码:"
        prop="name"
      >
        <el-input
          placeholder="银行账户代码"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="银行账户:"
        prop="name"
      >
        <el-input
          placeholder="银行账户"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="银行简称:"
        prop="name"
      >
        <el-input
          placeholder="银行简称"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="银行类别:"
        prop="type"
      >
        <el-radio
          v-model="addForm.type"
          :label="item"
          v-for="item in dict.types"
          :key="item"
          :disabled="formDisabled"
        >{{ item }}</el-radio>
      </el-form-item>
      <el-form-item
        label="上级银行:"
        prop="type"
      >
        <el-radio
          v-model="addForm.type"
          :label="item"
          v-for="item in dict.types"
          :key="item"
          :disabled="formDisabled"
        >{{ item }}</el-radio>
      </el-form-item>
      <el-form-item
        label="助记码:"
        prop="denomination"
      >
        <el-input
          placeholder="请输入"
          clearable
          :disabled="formDisabled"
          v-model="addForm.denomination"
        ></el-input>
      </el-form-item>
      <CitySelect v-model="addForm.cityCode" placeholder="省份" />
      <el-form-item
        label="工作日历:"
        prop="discountPrice"
      >
        <el-input
          placeholder="请输入"
          clearable
          :disabled="formDisabled"
          v-model="addForm.discountPrice"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="开户行名称:"
        prop="name"
      >
        <el-input
          placeholder="请输入"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="人行联行行号:"
        prop="name"
      >
        <el-input
          placeholder="请输入"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="人行联行名称:"
        prop="name"
      >
        <el-input
          placeholder="请输入"
          clearable
          :disabled="formDisabled"
          v-model="addForm.name"
        ></el-input>
      </el-form-item>
      <el-form-item
        label="店面:"
        prop="storeIds"
      >
        <job-shop
          v-model="addForm.storeIds"
          :disabled="addForm.id?true:false"
          placeholder="店面"
        />
      </el-form-item>
        <el-form-item
          label="状态:"
          prop="status"
        >
          <el-radio
            v-model="addForm.status"
            :label="item"
            :disabled="formDisabled"
            v-for="item in dict.statusOptions"
            :key="item"
          >{{ item }}</el-radio>
        </el-form-item>

      <el-row v-if="!formDisabled">
        <el-col
          :span="24"
          align="right"
        >
          <el-button
            type="primary"
            style="margin: 20px auto 0"
            @click="onSubmit"
          >保存</el-button>
        </el-col>
      </el-row>
    </el-form>
  </el-row>
</template>

<script>
import ElRow from 'element-ui/packages/row/src/row'
import baseMixin from '@/mixins/base'
export default {
  components: { ElRow },
  name: 'DialogDataForm',
  props: {
    value: {
      type: Object,
      default: () => ({}),
    },
    menus: {
      type: Object,
    },
  },
  mixins: [baseMixin({})],
  data () {
    return {
      //表单项
      dict: {
        coupon: [],
        statusOptions: ['启用', '禁用'],
        classifications: ['通用', '售前券', '售后券'],
        sills: ['无', '满减'],
        valids: ['时间范围', '领取后多少天过期'],
      },
      addForm: {},
      addFormRules: {
        name: [{ required: true, trigger: 'blur' }],
        classification: [{ required: true, trigger: 'blur' }],
        type: [{ required: true, trigger: 'blur' }],
        ruleAmount: [{ required: true, trigger: 'blur' }],
        isRule: [{ required: true, trigger: 'blur' }],
        isEffective: [{ required: true, trigger: 'blur' }],
      },
      formDisabled:false,
    }
  },
  async mounted () {
    this.setAddForm()
    if(this.value.id){
      this.formDisabled=true
    }
  },
  methods: {
    setAddForm () {
      if (this.value.id) {
        let { carPartsIds, carProjectIds, ...data } = this.value
        this.addForm = data;
        this.tableProjectList = carProjectIds || []
        this.tableFittingList = carPartsIds || []
        this.addForm.carPartsIds = []
        this.addForm.carProjectIds = []
      }
    },
    onSubmit () {
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          const options = this.addForm
          options.carProjectIds = []
          options.carPartsIds = []
          this.tableProjectList.forEach((item) =>
            options.carProjectIds.push(item.id)
          )
          this.tableFittingList.forEach((item) =>
            options.carPartsIds.push(item.id)
          )
          options.carProjectIds = options.carProjectIds.join()
          options.carPartsIds = options.carPartsIds.join()

          if (!this.value.id) {
            this.$emit('operate', options, 'send')
          } else {
            options.id = this.value.id
            this.$emit('operate', options, 'update')
          }
        } else {
          return false
        }
      })
    },
  },
}
</script>
<style lang="scss" scoped>
</style>

